/** @jsxImportSource @emotion/react */
import * as React from "react";
import {CCell, Cell, Table, TableBody, TableRow, Text,} from "customize-easy-ui-component";
import {DirectLink,} from "../../../routing/Link";
import {eqpTypeAllMap} from "../../../dict/eqpComm";
import {CCellUnit, RepLink,} from "../../common/base";
import {usePrefixDataTable} from "../../hook/usePrefixData";
import {useThreeColumnView} from "../../hook/useThreeColumnSubr";
import Img_Seal from "../../../images/seal.png";

const render设备品种={
  view:(orc:any)=><>{eqpTypeAllMap.get(orc?.设备品种)}</>,
};
const render层站门数={
  view:(orc:any)=><>{orc.电梯层数}  层   {orc.电梯站数}  站  {orc.电梯门数} 门</>,
};
//仅在正式报告用，而非原始记录采用的：无需纳入编辑器检查；
const config设备 = [
  [['使用单位名称', '_$使用单位'], ['统一社会信用代码', '_$使用单位信用码'] ],
  [['安装地点', '_$设备使用地点'], ],
  [['设备品种', '_$设备品种',render设备品种], ['产品型号', '_$型号'],],
  [['产品编号', '_$出厂编号'], ['单位内编号','_$单位内部编号'] ],
  [['使用登记证编号', '_$使用证号'], ['安全管理人员', '安全员']],
  [['制造单位名称', '_$制造单位'] ,['制造日期', '_$制造日期'] ],
  [['改造单位名称','_$改造单位'],  ['改造日期', {n:'改造日期',t:'d'}],  ],
  [['维护保养单位名称', '_$维保单位']],
    //性能参数     [['额定速度（上行）','_$额定速度上','m/s'],  ['额定速度（下行）', '_$额定速度下','m/s'] ],
  [['额定载重量','_$额定载荷','kg'], ['额定速度', '_$运行速度','m/s'] ],
  [['层站门数', '_$电梯层数',render层站门数], ['控制方式', '_$控制方式',] ],
  [['油缸数量','_$油缸数量','个'], ['顶升方式', '_$顶升形式'] ],
  [['整机防爆标志','_$防爆标志',], ['区域防爆等级', '_$防爆等级'], ],
];
//拆分成2个编辑器的
const config设备上=config设备.slice(0, 8);
const config设备下=config设备.slice(9);    //中间一行 ['额定速度', #需手工拼凑！

export const 报告设备详情= ( {theme, orc, rep } : { orc: any,rep:any, theme:any}
) => {
  const renderUpper=usePrefixDataTable({config: config设备上, orc, rep, slash:true});
  // const [firstPart,_s]=useThreeColumnView({orc, config:config设备下,slash:true, embedCol: [ <CCell rowSpan={4}>设备技术参数</CCell> ]});
  const [firstPart,_s]=useThreeColumnView({orc, config:config设备下,slash:true});
  return <React.Fragment>
    <Table id={'Survey'} fixed={ ["6.1%","10%","50%","8.1%","4%","%"] }  css={ {borderCollapse: 'collapse' } }  tight  miniw={800}>
      <TableBody>
        <RepLink rep={rep} tag={'Survey'}>
          {renderUpper}
        </RepLink>
      </TableBody>
    </Table>
    <Table fixed={ ["4.8%","12.7%","24%","9%","12.2%","7%","%"] }  css={ {borderCollapse: 'collapse' } }  tight  miniw={800}>
      <TableBody>
        <TableRow>
          <CCell rowSpan={5}>设备技术参数</CCell><CCell rowSpan={2}>额定载重量</CCell><CCellUnit  rowSpan={2}  colSpan={2} unit={'kg'}>{orc.额定载荷 || '／'}</CCellUnit>
          <CCell rowSpan={2}>额定速度</CCell><CCell>上行</CCell><CCellUnit unit={'m/s'}>{orc.额定速度上 || '／'}</CCellUnit>
        </TableRow>
        <TableRow>
            <CCell>下行</CCell><CCellUnit unit={'m/s'}>{orc.额定速度下 || '／'}</CCellUnit>
        </TableRow>
        <RepLink rep={rep} tag={'Survey'}>
          {firstPart}
        </RepLink>
        <TableRow>
          <CCell colSpan={2}>检验依据</CCell>
          <CCell colSpan={5}>《电梯监督检验和定期检验规则》（TSG T7001—2023）</CCell>
        </TableRow>
        <DirectLink href={`/report/${rep?.modeltype}/ver/${rep?.modelversion}/${rep?.id}/Conclusion#Conclusion`}>
          <TableRow>
            <CCell>检验结论</CCell><CCell colSpan={6}><Text variant="h1" css={{fontSize:'2.8rem'}}>{orc?.检验结论}</Text></CCell>
          </TableRow>
        </DirectLink>
        <DirectLink href={`/report/${rep?.modeltype}/ver/${rep?.modelversion}/${rep?.id}/Witness#Witness`}>
          <TableRow>
            <CCell>备注</CCell>
            <Cell split={true} colSpan={6}><div css={{minHeight: '1rem', whiteSpace: 'pre-wrap'}}>
              {orc.大备注 ?? '／'}
            </div></Cell>
          </TableRow>
        </DirectLink>
      </TableBody>
    </Table>
    {检验编制核准Hydlic({orc,rep})}
  </React.Fragment>;
};

/**隐含6列的；*/
export const 检验编制核准Hydlic= ({ orc,rep } : { orc: any, rep:any }
) => {
  return <Table fixed={ ["4.2%","27%","27%","4%","12%","%"] }  css={ {borderCollapse: 'collapse' } }  tight miniw={800}>
    <TableBody>
      <DirectLink  href={`/report/${rep?.modeltype}/ver/${rep?.modelversion}/${rep?.id}/Conclusion`}>
        <TableRow>
          <CCell colSpan={3}>下次检验日期</CCell>
          <CCell colSpan={3}>{orc?.新下检日}</CCell>
        </TableRow>
        <TableRow>
          <CCell>检测</CCell>
          <CCell colSpan={2}>{orc.检验人IDs}</CCell>
          <CCell>日期</CCell>
          <CCell>{orc.检验日期 || '／'}</CCell>
          <CCell rowSpan={3}>
            <div css={{
              height:'8rem',
              '::before': {
                filter: 'opacity(30%)',
                width: '100%',
                height: '100%',
                backgroundImage: `url(${Img_Seal})`,
                content: '" "',
                position: 'absolute',
                top: 0,
                left: 0,
                backgroundRepeat: 'no-repeat',
                backgroundPosition: 'center',
              }
            }}>
              <Table  fixed={ ["40%","%"]  } css={ {borderCollapse: 'collapse',height:'fill-available'} } tight miniw={800}>
                <TableBody>
                  <TableRow>
                    <CCell css={{border:'none'}}>机构核准证号：</CCell>
                    <CCell css={{border:'none'}}>{rep?.isp?.ispu?.agency?.apno}</CCell>
                  </TableRow>
                  <TableRow>
                    <CCell css={{border:'none'}} colSpan={2}>（检测机构公章或者检测专用章）</CCell>
                  </TableRow>
                </TableBody>
              </Table>
            </div>
          </CCell>
        </TableRow>
      </DirectLink>
      <TableRow>
        <CCell>审核</CCell>
        <CCell colSpan={2}></CCell>
        <CCell>日期</CCell>
        <CCell></CCell>
      </TableRow>
      <TableRow >
        <CCell>批准</CCell>
        <CCell colSpan={2}></CCell>
        <CCell>日期</CCell>
        <CCell></CCell>
      </TableRow>
    </TableBody>
  </Table>;
};
